<!DOCTYPE html>
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
		<title></title>
		<link rel="stylesheet" href="../layui/css/layui.css">
	</head>
	<body>

		<fieldset class="layui-elem-field layui-field-title" style="...">
			<legend>添加商品信息</legend>
		</fieldset>

	<form class="layui-form" action="" enctype="multipart/form-data" id="form_goods" method="post">

		<div class="layui-form-item">
			<label class="layui-form-label">商品名称</label>
			<div class="layui-input-block">
				<input type="text" id="gname" name="gname" lay-verify="title" autocomplete="off" placeholder="请输入商品名称" class="layui-input">
			</div>
		</div>
		<div class="layui-form-item">
			<label class="layui-form-label">商品类型</label>
			<div class="layui-input-block" id="tname">

			</div>
		</div>
		
			
		<div class="layui-form-item">
				<label class="layui-form-label">商品价格</label>
				<div class="layui-input-inline">
					<input type="number" id="gprice" name="gprice" autocomplete="off" class="layui-input">
				</div>
				<div class="layui-form-mid layui-word-aux">元</div>
		</div>

		<div class="layui-from-item">
				<label class="layui-form-label">商品图片</label>
				<div class="layui-upload layui-input-inline">
					<input type="file" name="gpics" id="gpics" multiple="multiple">
					<div id="preview"></div>
				</div>
			</div>
			
		<div class="layui-form-item" style="margin-left: 20px;" id="showpic"></div>


		<div class="layui-from-item layui-form-text">
			<label class="layui-form-label">商品描述</label>
			<div class="layui-input-inline">
				<textarea placeholder="请输入内容" class="layui-textarea" id="remark" name="remark"></textarea>
			</div>
		</div>

			<hr class="layui-border-black">



			<div class="layui-from-item">
			<div class="layui-input-block">
				<button class="layui-btn" lay-filter="add" type="button" id="add">立即提交</button>
				<button type="reset" class="layui-btn layui-btn-primary">重置</button>
			</div>
		</div>
	</form>
		
		<script src="../layui/layui.js" charset="utf-8"></script>
		<script src="../../js/jquery-3.4.1.min.js"></script>
		<script src="../../js/ajax.js"></script>
		<script src="../../js/ajaxfileupload.js"></script>
		<script>

		layui.use(['form', 'table', 'jquery'], function () {
		var form = layui.form
			, table = layui.table
			, $ = layui.jquery;
			//发送get请求
			$.get("../../type?op=findall", function (rs) {
				var arr = rs.data;
				$("#tname").empty();
				$.each(arr, function (i, ty) {
					$("#tname").append('<input type="checkbox" name="tname" value="' + ty.tname + '" title="'+ty.tname+'">');
				});
				//更新渲染下拉框
				form.render('checkbox');
			}, "json");

			});

			$("#add").click(function () {
				let gname = $("#gname").val();
				let gprice = $("#gprice").val();
				let objs = $("#tname input:checked");
				let tname = '';
				for (var i = 0; i < objs.length; i++) {
					tname += $(objs[i]).attr("title") + ',';
				}
				tname=tname.substring(0,tname.length-1);
				let remark = $("#remark").val();
				console.log(gname,gprice,tname,remark);
				$.ajaxFileUpload({
					url: '../../goods',
					type:'POST',
					dataType: 'json',
					fileElementId: 'gpics',
					secureuri: false,
					data: {
						gname: gname,
						tname: tname,
						gprice: gprice,
						remark: remark,

					},
					success: function (rs) {
						if (rs==1){
							alert('添加成功');
						}else {
							alert('添加失败');
						}

					},
					error: function (rs) {
						alert('注册失败');
					}
				});
			});
		</script>
	</body>
</html>
